<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>

<body>
	<div>
		<div align="center" style="margin-top: 30px;">
			<form action="${pageContext.request.contextPath}/SelectGoodsType"
				method="post">
				<table align="center">
					<tr>
						<td><input type="text" name="type_name" size="50"
							placeholder="类型名称"
							style="width: 300px; height: 30px; border: 1px solid black; border-radius: 3px; font-size: 16px;"></td>
						<td><button type="submit"
								style="width: 100px; height: 30px; border: 1px solid black; border-radius: 3px; background-color: #b9bcca;">查询</button></td>

					</tr>
				</table>
			</form>
		</div>

		<div class="select_frame" style="margin-top: 30px;">
			<form>
				<table width="100%" style="height: 10px;" id="table" cellpadding="0"
					cellspacing="0" align="center" border="0">
					<tr style="height: 10px;">
						<td align="center"
							style="width: 5%; height: 40px; border: 1px solid gray; border-radius: 1px;">编号</td>
						<td align="center" style="width: 10%; border: 1px solid gray;">类型名称</td>
						<td align="center" style="width: 10%; border: 1px solid gray;">类型描述</td>

						<td align="center" style="width: 30%; border: 1px solid gray;">操作</td>
					</tr>
					<!-- 				</table> -->
					<!-- 				<table width="100%" align="center" cellpadding="0" cellspacing="0" id="table" style="margin:0 auto;"> -->
					<c:forEach var="it" items="${list }">

						<tr height="50" align="center">
							<td style="width: 3%;">${it.type_id}</td>
							<td style="width: 10%;">${it.type_name}</td>
							<td style="width: 10%;">${it.type_desc}</td>


							<td style="width: 20%;">
								<table cellspacing="20" cellpadding="0">

									<td><a
										href="${pageContext.request.contextPath}/Login_0615/modifyGoodsType.jsp?type_id=${it.type_id}&type_name=${it.type_name }&type_desc=${it.type_desc } "
										style="text-decoration: none;"> <font size="4"
											color="#d9a5da">修改类型</font></a></td>
									<td><a
										href=" ${pageContext.request.contextPath}/DeleteGoodsType?type_id=${it.type_id}"
										style="text-decoration: none;"
										onclick="return confirm('确认删除“${it.type_name }”？');"><font
											size="5" color="#d9a5da">删除</font></a></td>
								</table>
							</td>
						</tr>
					</c:forEach>
				</table>
			</form>

			<div class="page_turn" style="margin-top: 40px;">

				<form>
					<center>
						<span>共条</span> <span><a href="#" id="spanFirst">首页</a></span> <span><a
							href="#" id="spanPre">上一页</a></span> <span id="spanPageNum"></span>/<span
							id="spanTotalPage"></span>页 <span><a href="#"
							id="spanNext">下一页</a></span> <span><a href="#" id="spanLast">尾页</a></span>
						<span><a
							href="${pageContext.request.contextPath}/user/home_page.jsp"
							target="right">【返回主页】</a></span>
					</center>
				</form>

			</div>
		</div>
	</div>

	<script type="text/javascript">
		var theTable = document.getElementById("table");
		var totalPage = document.getElementById("spanTotalPage");
		var pageNum = document.getElementById("spanPageNum");
		var spanPre = document.getElementById("spanPre");
		var spanNext = document.getElementById("spanNext");
		var spanFirst = document.getElementById("spanFirst");
		var spanLast = document.getElementById("spanLast");
		var numberRowsInTable = theTable.rows.length;
		var pageSize = 10;//每一页条数
		var page = 1;//
		//下一页
		function next() {
			hideTable();
			currentRow = pageSize * page;
			maxRow = currentRow + pageSize;
			if (maxRow > numberRowsInTable) {
				maxRow = numberRowsInTable;
			}
			for (var i = currentRow; i < maxRow; i++) {
				theTable.rows[i].style.display = '';
			}
			page++;
			if (maxRow == numberRowsInTable) {
				nextText();
				lastText();
			}
			showPage();
			preLink();
			firstLink();
		}
		//上一页
		function pre() {
			hideTable();
			page--;
			currentRow = pageSize * page;
			maxRow = currentRow - pageSize;
			if (currentRow > numberRowsInTable)
				currentRow = numberRowsInTable;
			for (var i = maxRow; i < currentRow; i++) {
				theTable.rows[i].style.display = '';
			}
			if (maxRow == 0) {
				preText();
				firstText();
			}
			showPage();
			nextLink();
			lastLink();
		}
		//第一页
		function first() {
			hideTable();
			page = 1;
			for (var i = 0; i < pageSize; i++) {
				theTable.rows[i].style.display = '';
			}
			showPage();
			preText();
			nextLink();
			lastLink();
		}
		//最后一页
		function last() {
			hideTable();
			page = pageCount();
			currentRow = pageSize * (page - 1);
			for (var i = currentRow; i < numberRowsInTable; i++) {
				theTable.rows[i].style.display = '';
			}
			showPage();
			preLink();
			nextText();
			firstLink();
		}
		function hideTable() {
			for (var i = 0; i < numberRowsInTable; i++) {
				theTable.rows[i].style.display = 'none';
			}
		}
		function showPage() {
			pageNum.innerHTML = page;
		}
		//总共页数
		function pageCount() {
			var count = 0;
			if (numberRowsInTable % pageSize != 0)
				count = 1;
			return parseInt(numberRowsInTable / pageSize) + count;
		}
		//显示链接
		function preLink() {
			spanPre.innerHTML = "<a href='javascript:pre();'>上一页</a>";
		}
		function preText() {
			spanPre.innerHTML = "上一页";
		}
		function nextLink() {
			spanNext.innerHTML = "<a href='javascript:next();'>下一页</a>";
		}
		function nextText() {
			spanNext.innerHTML = "下一页";
		}
		function firstLink() {
			spanFirst.innerHTML = "<a href='javascript:first();'>首页</a>";
		}
		function firstText() {
			spanFirst.innerHTML = "首页";
		}
		function lastLink() {
			spanLast.innerHTML = "<a href='javascript:last();'>尾页</a>";
		}
		function lastText() {
			spanLast.innerHTML = "尾页";
		}
		//隐藏表格
		function hide() {
			for (var i = pageSize; i < numberRowsInTable; i++) {
				theTable.rows[i].style.display = 'none';
			}
			totalPage.innerHTML = pageCount();
			pageNum.innerHTML = '';
			nextLink();
			lastLink();
		}
		hide();

		//单双行颜色区分
		function doubleBgColor(Table, Bg1, Bg2) {
			for (var i = 0; i < Table.rows.length; i++) {
				Table.rows[i].bgColor = i % 2 ? Bg2 : Bg1;
			}
		}

		function toCheck() {
			var checkAll = document.getElementById("firstCb");
			var checkboxs = document.getElementsByName("nid");
			var countnum = 0;
			for (var i = 0; i < checkboxs.length; i++) {
				if (checkboxs[i].checked) {
					countnum++;
				}
			}
			if (countnum == checkboxs.length) {
				checkAll.checked = true;
			} else {
				checkAll.checked = false;
			}
		}

		window.onload = function() {
			showPage();
			doubleBgColor(document.getElementById("table"), "#DDDDDD", "FFFFF");
			document.getElementById("delSelected").onclick = function() {
				var r = confirm("您确定要删除选中信息吗？");
				if (r == true) {
					var srr = "";
					var inp = document.getElementsByName("nid");
					for (var i = 0; i < inp.length; i++) {
						if (inp[i].checked == true) { //input的样式是checkbox时就添加到空数组中;
							srr += inp[i].value + ",";
						}
					}
					location.href = "${pageContext.request.contextPath}/Delete?allnid="
							+ srr + "";
				}
			}

			//获取checkbox
			document.getElementById("firstCb").onclick = function() {
				//获取下摆你列表中所有cd
				var cbs = document.getElementsByName("nid");
				//遍历
				for (var i = 0; i < cbs.length; i++) {
					//设置cbs[]的check状态 = firstCb.checked
					cbs[i].checked = this.checked;
				}
			}
		};
	</script>



</body>
</html>